@import "mixin_helpers";
@import "arrow";


//chat box widget

@include arrow-box($selector: ".chat-message-box", $border-color:#d8d8d8, $box_color: #fff, $border_width: 1px, $arrow_size: 7px, $centered: false, $edge: 10px, $position: "top");

.chat-message-box {
  @include border-radius(4px);
  margin-bottom: 15px;
  textarea {
    border: none;
    @include box-shadow(none);
    margin: 5px;
    width: 97% !important;
    background: #fff;

    &:focus {
      border: none;
    }
  }
}

.closable-chat-box {
  .chat-message-box {
    margin-bottom: 0;

    textarea {
      height: 20px;
    }
  }

  .actions {
    display: none;
  }

  &.open {
    .chat-message-box {
      margin-bottom: 15px;

      textarea {
        height: auto;
      }
    }

    .actions {
      display: block;
    }
  }

  .fields {

    @include clearfix;
    position: relative;

    ul {
      float: left;
      margin-left: 50px;
      margin-bottom: 2px;
      list-style: none;
      padding: 0;

      li {
        line-height: 18px;
        color: #949494;
      }
    }

    a {
      color: #393939;
    }

    .avatar {
      position: absolute;
      left: 0;
      img {
        max-width: 36px;
        max-height: 36px;
      }
    }
  }



}

